import React from 'react';
import { HashRouter, Routes, Route } from 'react-router-dom';
import Layout from '../App';
import HomePage from '../pages/Home/Home';
import GameDetail from '../pages/GameDetail/GameDetail';
import NotFoundPage from '../pages/NotFoundPage';
import SettingsPage from '../pages/SettingsPage';
import CustomFontSizeGuide from '../components/CustomFontSizeGuide';
import FontSizeDemo from '../components/FontSizeDemo';

// 路由提供者组件
const AppRouter: React.FC = () => {
  return (
    <HashRouter>
      <Routes>
        {/* 外层布局路由，包含Header */}
        <Route path="/" element={<Layout />}>
          {/* 嵌套路由 */}
          <Route index element={<HomePage />} />
          <Route path="gameDetail/:id" element={<GameDetail />}/>
          <Route path="demo" element={<FontSizeDemo />} />
          <Route
            path="custom-font-size-guide"
            element={<CustomFontSizeGuide />}
          />
          <Route path="settings" element={<SettingsPage />} />
        </Route>
        {/* 404页面 */}
        <Route path="*" element={<NotFoundPage />} />
      </Routes>
    </HashRouter>
  );
};

export default AppRouter;
